<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>企业提交线索</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta http-equiv="Access-Control-Allow-Origin" content="*">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<link rel="stylesheet" href="layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="css/main.css" media="all" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="css/home.css" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css" />
		<link rel="stylesheet" type="text/css" href="css/styles.css"/>
		<script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootstrap-select.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="http://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/vue.resource/1.0.3/vue-resource.min.js"></script>
	</head>

	<body class="main_body">
		<div class="layui-layout layui-layout-admin">
			<!-- 顶部 -->
			<div class="layui-header header">
				<div class="layui-main">
					<a href="#" class="logo">企业提交线索</a>
					<!-- 顶部右侧菜单 -->
					<ul class="layui-nav top_menu">
						<li class="layui-nav-item" pc>
							<a href="javascript:;">
								<img src="img/pic01.jpg" class="layui-circle" width="35" height="35">
								<cite>请叫我马哥</cite>
							</a>
							<dl class="layui-nav-child">
								<dd>
									<a href="javascript:;" data-url=""><i class="iconfont icon-zhanghu" data-icon="icon-zhanghu"></i><cite>个人资料</cite></a>
								</dd>
								<dd>
									<a href="javascript:;" data-url=""><i class="iconfont icon-shezhi1" data-icon="icon-shezhi1"></i><cite>修改密码</cite></a>
								</dd>
								<dd>
									<a href="javascript:;"><i class="iconfont icon-loginout"></i><cite>退出</cite></a>
								</dd>
							</dl>
						</li>
					</ul>
				</div>
			</div>
			<!-- header导航 -->
			<nav class="navbar navbar-default">
				<div class="container-fluid">
					<div class="navbar-header">
						<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
					        <span class="sr-only">Toggle navigation</span>
					        <span class="icon-bar"></span>
					        <span class="icon-bar"></span>
					        <span class="icon-bar"></span>
					    </button>
						<a class="navbar-brand" href="index.html">概览</a>
					</div>
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">
							<li>
								<a href="project_manage.html">项目管理</a>
							</li>
							<li >
								<a href="information_dynamic.html">信息动态</a>
							</li>
							<li>
								<a href="co_operation.html">协办任务</a>
							</li>
							
							<li>
								<a href="go_out.html">外出申请</a>
							</li>
							<li>
								<a href="outgo_approval.html">外出审批</a>
							</li>
							<li class="active">
								<a href="submit_clues.html">企业提交线索</a>
							</li>
							<li>
								<a href="attend_manage.html">考勤管理</a>
							</li>
							<li>
								<a href="team_manage.html">部门管理</a>
							</li>
							<li>
								<a href="member_manage.html">成员管理</a>
							</li>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">设置 <span class="caret"></span></a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">Action</a>
									</li>
									<li>
										<a href="#">Another action</a>
									</li>
									<li>
										<a href="#">Something else here</a>
									</li>
									<li role="separator" class="divider"></li>
									<li>
										<a href="#">Separated link</a>
									</li>
									<li role="separator" class="divider"></li>
									<li>
										<a href="#">One more separated link</a>
									</li>
								</ul>
							</li>
						</ul>
					</div 
				</div>
			</nav>
			<!--树状图-->
			<div class="layui-side layui-bg-black" id="shu" style="display: none;">
				<div class="navBar layui-side-scroll" style="height: auto;">
					<div class="tree well">
								<ul>
									<li>
										<span><i class="icon-folder-open"></i> 顶级节点1</span>
										<ul>
											<li>
												<span><i class="icon-minus-sign"></i> 一级节点1</span>
												<a href=""></a>
												<ul>
													<li>
														<span><i class="icon-leaf"></i> 二级节点1_1</span>
														<a href=""></a>
													</li>
												</ul>
											</li>
											<li>
												<span><i class="icon-minus-sign"></i> 一级节点2</span>
												<a href=""></a>
												<ul>
													<li>
														<span><i class="icon-leaf"></i>二级节点2_1</span>
														<a href=""></a>
													</li>
													<li>
														<span><i class="icon-minus-sign"></i> 二级节点2_2</span>
														<a href=""></a>
														<ul>
															<li>
																<span><i class="icon-minus-sign"></i>三级节点2_1</span>
																<a href=""></a>
																<ul>
																	<li>
																		<span><i class="icon-leaf"></i>四级节点2_1</span>
																		<a href=""></a>
																	</li>
																	<li>
																		<span><i class="icon-leaf"></i> 四级节点2_2</span>
																		<a href=""></a>
																	</li>
																</ul>
															</li>
															<li>
																<span><i class="icon-leaf"></i>三级节点2_2</span>
																<a href=""></a>
															</li>
															<li>
																<span><i class="icon-leaf"></i> 三级节点2_3</span>
																<a href=""></a>
															</li>
														</ul>
													</li>
													<li>
														<span><i class="icon-leaf"></i>二级节点2_3</span>
														<a href=""></a>
													</li>
												</ul>
											</li>
										</ul>
									</li>
									<li>
										<span><i class="icon-folder-open"></i> 顶级节点2</span>
										<a href=""></a>
										<ul>
											<li>
												<span><i class="icon-leaf"></i> 一级节点2_1</span>
												<a href=""></a>
											</li>
										</ul>
									</li>
								</ul>
							</div>
				</div>
			</div>
			<!-- 右侧内容 -->
			<div class="layui-body layui-form">
				<div class="layui-tab marg0" lay-filter="bodyTab">
					<div class="max-title">
						<div class="fl">企业提交线索</div>
						<ul class="max-title-ul fr tj-btns ">
							<li data-toggle="modal" data-target="#daoru" data-whatever="@mdo"><img src="img/dr-icon.png" />导入</li>
							<li data-toggle="modal" data-target="#out" data-whatever="@mdo"><img src="img/dc-icon.png" />导出</li>
						</ul>
					</div>
					<div class="cont-top">
						<div class="dropdown navbar-left hidden-xs">
							<select class="selectpicker form-control" title="全部动态" data-live-search="true" onchange="selectOnchang(this)">
								<option value="在谈线索">在谈线索</option>
								<option value="签约项目">签约项目</option>
								<option value="在建项目">在建项目</option>
								<option value="投项目资">投项目资</option>
								<option value="销号项目">销号项目</option>
								<option value="销号项目">待审核项目</option>
							</select>
						</div>						
						<div class="dropdown navbar-right sort hidden-xs">
							<select class="selectpicker form-control" title="默认排序" onchange="selectOnchang(this)">
								<option value="项目名称">顺序</option>

								<option value="项目商家">降序</option>

								<option value="会员名称">会员名称</option>

								<option value="4">4</option>
							</select>
						</div>
					</div>
					<div class="layui-form form-wd" id="app2">
						<!--导入 -->
						<div class="modal fade" id="daoru" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
							<div class="modal-dialog" role="document">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
										<h4 class="modal-title" id="daoru">导入项目</h4>
									</div>
									<div class="modal-body">
										<div class="">
											<div class="">
												<p><img src="img/down.png" />&nbsp;&nbsp;下载模板</p>
												<span>为提高导入成功率，请下载并使用系统提供的模板</span>
												<button type="button" class="btn btn-info downs">下载模板</button>
											</div>
											<div class="">
												<p><img src="img/up.png" />&nbsp;&nbsp;上传文件</p>
												<p>仅支持xlsx、xls、csv，文件大小未4M。</p>
												<input id='location' class="form-control fl" disabled>
												<input type="button" id="i-check" value="浏览" class="btn fl" onclick="$('#i-file').click();">
												<input type="file" id='i-file' accept=".xlsx,.xls,.csv,.doc" onchange="$('#location').val($('#i-file').val());" style="display: none">
												<div class="clear"></div>
											</div>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
										<button type="button" class="btn btn-primary" @click="addUser">确定</button>
									</div>
								</div>
							</div>
						</div>
						<!--导出 -->
						<div class="modal fade" id="out" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
							<div class="modal-dialog" role="document">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
										<h4 class="modal-title" id="out">导出项目</h4>
									</div>
									<div class="modal-body">
										<p>导出哪些数据</p>
										<div class="form-group out">
											<label class="radio-inline">
											        <input type="radio" name="optionsRadiosinline" id="yes" value="option1" title="当前筛选的数据(200条)" checked>
											    </label>
											<label class="radio-inline">
											        <input type="radio" name="optionsRadiosinline" id="no"  value="option2" title="全部数据">
											    </label>
										</div>
										<p>导出哪些字段</p>
										<div class="form-group out">
											<section>
												<div id="dayCheck1" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input class="dayCheckBox" type="checkbox" name="" id="day1" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck2" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day2" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck3" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day3" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck4" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day4" value="option1" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck4" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day4" value="option1" />
													<label for="day1"></label>
												</div>
											</section>
											<div class="clear"></div>
										</div>
										<div class="xz-txt">可选字段</div>
										<div class="form-group out">
											<section>
												<div id="dayCheck1" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input class="dayCheckBox" type="checkbox" name="" id="day1" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck2" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day2" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck3" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day3" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck4" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day4" value="option1" />
													<label for="day1"></label>
												</div>
											</section>
											<section>
												<div id="dayCheck4" class="dayCheck dayCheckDiv">
													<p class="dayTxt">字段名称</p>
													<input type="checkbox" class="dayCheckBox" name="" id="day4" value="option1" />
													<label for="day1"></label>
												</div>
											</section>
										</div>
									</div>
									<div class="modal-footer">
										<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
										<button type="button" class="btn btn-primary" @click="addUser">确定</button>
									</div>
								</div>
							</div>
						</div>
						<!--列表-->
						<table class="table table-bordered table-hover">
							<thead>
								<tr style="background: #ccc;">
									<th>id</th>
									<th>项目名称</th>
									<th>所属产业</th>
									<th>是否返乡创业</th>
									<th>联系人姓名</th>
									<th>联系人电话</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<!--v-for="item in projectInfo"-->
								<tr class="text-center">
									<td>1</td>
									<td>
										项目名称
									</td>
									<td>20000.00</td>
									<td>合肥时代数码港合肥时代数码港</td>
									<td>战三</td>
									<td>12830183012830</td>
									<td width="22%">
										<button class="btn-info btn-sm">查看/审核</button>
									</td>
								</tr>
								<tr class="text-center">
									<td>2</td>
									<td>
										项目名称
									</td>
									<td>20000.00</td>
									<td>合肥时代数码港合肥时代数码港</td>
									<td>李四</td>
									<td>1012038109</td>
									<td>
										<button class="btn-info btn-sm">查看/审核</button>
									</td>
								</tr>
							</tbody>
						</table>

						<div class="foot-div">
							<div class="checkbox fl">
								<label>
							    <!--  <input type="checkbox" lay-skin="primary"  class="all-input"> -->
							      	<select class="selectpicker form-control alls" title="批量操作" onchange="selectOnchang(this)">
										<option value="项目名称">顺序</option>
										<option value="项目商家">降序</option>
									</select>
									
							    </label>
							</div>
							<!--分页-->
							<script type="text/x-template" id="page">
								<ul class="pagination page-ul fr">
									<li>
										<a class="tonum">共110条</a>
									</li>
									<li>
										<a href="#">首页</a>
									</li>
									<li v-show="current != 1" @click="current-- && goto(current)">
										<a href="#">上一页</a>
									</li>
									<li v-for="index in pages" @click="goto(index)" :class="{'active':current == index}" :key="index">
										<a href="#">{{index}}</a>
									</li>
									<li v-show="allpage != current && allpage != 0 " @click="current++ && goto(current++)">
										<a href="#">下一页</a>
									</li>
									<li>
										<a href="#">尾页</a>
									</li>
								</ul>
							</script>
							<div id="app">
								<page></page>
							</div>

						</div>

					</div>

				</div>
			</div>
			</div>
			<!-- 移动导航 -->
			<div class="site-tree-mobile layui-hide" id="shu-btn">
				<i class="layui-icon" >
					<img src="img/ri-line.png"/>
				</i>
			</div>
			<script src="js/public.js" type="text/javascript" charset="utf-8"></script>
			<script type="text/javascript" src="layui/layui.js"></script>
			<script type="text/javascript" src="js/leftNav.js"></script>
			<script type="text/javascript" src="js/index.js"></script>
			<script type="text/javascript">
				$(function() {
					$('input[id=lefile]').change(function() {
						$('#photoCover').val($(this).val());
					});
					$('input[id=lefile2]').change(function() {
						$('#photoCover2').val($(this).val());
					});
					//下拉选择
					function selectOnchang(obj) {
						var value = obj.options[obj.selectedIndex].value;
						console.log(value);
					}
					//导出内容
					$(".dayCheckBox").click(function() {
						$(".dayCheckDiv").each(function() {
							if($(this).children('input').is(":checked")) {
								$(this).removeClass("dayCheck").addClass("dayUnCheck");
							} else {
								$(this).removeClass("dayUnCheck").addClass("dayCheck");
							}
						});
					});

				})

				//分页
				Vue.component("page", {
					template: "#page",
					data: function() {
						return {
							current: 1,
							showItem: 5,
							allpage: 13
						}
					},
					computed: {
						pages: function() {
							var pag = [];
							if(this.current < this.showItem) { //如果当前的激活的项 小于要显示的条数
								//总页数和要显示的条数那个大就显示多少条
								var i = Math.min(this.showItem, this.allpage);
								while(i) {
									pag.unshift(i--);
								}
							} else { //当前页数大于显示页数了
								var middle = this.current - Math.floor(this.showItem / 2), //从哪里开始
									i = this.showItem;
								if(middle > (this.allpage - this.showItem)) {
									middle = (this.allpage - this.showItem) + 1
								}
								while(i--) {
									pag.push(middle++);
								}
							}
							return pag
						}
					},
					methods: {
						goto: function(index) {
							if(index == this.current) return;
							this.current = index;
							//这里可以发送ajax请求
						}
					}
				})
				
				new Vue({
					el: '#app2',
					created: function() {
						data = {
							data: ''

						};
						var url = "http://192.168.31.245:8080/invest-web/findAllProject";
						this.$http.post(url, data).then(function(data) {
							if(data.body.code == 1) {
								var json = data.body.data;
								console.log(json)
								console.log(data.body.total)
								this.data = json;
							} else {
								console.log(data.body.msg)
							}
						}, function(response) {
							console.log(response.data);
						})

					}
				});
			</script>
	</body>

</html>